<template>
  <FancyList :api-url="url" :per-page="10">
    <template #item="{ body, username, likes }">
      <div class="item">
        <p>{{ body }}</p>
        <p class="meta">by {{ username }} | {{ likes }} likes</p>
      </div>
    </template>
  </FancyList>
</template>

<script setup lang="ts">
import {ref} from 'vue'
import FancyList from '@/pages/vue3Advance/comp/FancyList.vue'
const url = ref('')
</script>


<style scoped>
.meta {
  font-size: 0.8em;
  color: #42b883;
}
</style>